<template>
  <div style="padding-bottom: 50px;background-color: #fff;">
    <a-row v-if="status == 'rejected'">
      <a-col :xs="{ span : 24 }" :sm="{ span:12 }" class="result">审核拒绝：{{remark}}</a-col>
    </a-row>
    <a-form
      @submit="handleSubmit"
      style="margin-top: 8px;width:80%;margin:0 auto;background-color: #fff;"
      :form="form"
    >
      <a-row>
        <a-col :xs="{ span : 24 }" :sm="{ span:9 }" class="formGroupTitle">账户信息</a-col>
      </a-row>
      <!-- <a-form-item v-bind="formItemLayout" label="Email" help="
                此邮箱将用于接收重要邮件，请准确填写，填写后无法更改">
                <a-input name="email" placeholder="请输入邮箱地址" v-decorator="[
                      'email', { rules: [{type: 'email', message: '请输入有效邮箱地址!', },
                       {required: true, message: '请输入邮箱地址!'},
                       {validator: validatemail}],
                       validateTrigger: 'blur'}
                      ]" />
      </a-form-item>-->
      <!-- , pattern: /^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/ -->

      <a-form-item
        v-bind="formItemLayout"
        label="手机号码"
        help="
                此手机号将用于接收重要信息，请准确填写，填写后无法更改"
      >
        <div>
          <a-input
            :disabled="phoneDisabled"
            name="phone"
            placeholder="请输入手机号码"
            v-decorator="[
                                        'phone',
                                        {
                                         rules: [{ required: true, message: '请输入手机号码!' },{validator: validateCode}],validateTrigger: 'blur'
                                        }
                                        ]"
            @change="phoneChange"
          />
        </div>
      </a-form-item>
      <a-row>
        <a-col :xs="{ span : 24 }" :sm="{ span:9 }" class="formGroupTitle">基本信息</a-col>
      </a-row>
      <a-form-item v-bind="formItemLayout" label="客户类型">
        <div>
          <a-select
            :disabled="typeDisabled"
            class="width-sty"
            v-decorator="[
                        'merchantType',
                        {rules: [{ required: true, message: '请选择客户类型' }],initialValue: 'org'}
                      ]"
            placeholder="请选择客户类型"
            @change="handleChange1"
          >
            <a-select-option value="org">企业</a-select-option>
            <a-select-option value="mer">个体工商户</a-select-option>
          </a-select>
        </div>
      </a-form-item>

      <a-form-item v-bind="formItemLayout" label="客户名称">
        <a-input
          v-decorator="[
                        'merchantName',
                        {rules: [{ required: true, message: '请输入客户名称' }]}
                      ]"
          placeholder="请填与营业执照一致的名称"
          @change="merchantNameChange"
        />
      </a-form-item>

      <a-form-item v-bind="formItemLayout" label="客户简称">
        <a-input
          v-decorator="[
                        'shortname',
                        {rules: [{ required: true, message: '请输入客户简称' }]}
                      ]"
          placeholder="请输入客户简称"
        />
      </a-form-item>

      <a-form-item v-bind="formItemLayout" label="社会统一信用代码/注册号">
        <a-input
          v-decorator="[
                        'orgRegisterNo',
                        {rules: [{ required: true, message: '社会统一信用代码/注册号' },{
                           validator: validateOrgRegisterNo,
                         }],validateTrigger: 'blur'}
                      ]"
          placeholder="请输入社会统一信用代码/注册号"
        />
      </a-form-item>

      <a-form-item v-bind="formItemLayout" required label="营业期限">
        <div>
          <a-date-picker
            :locale="zh_CN"
            :disabledDate="disabledStartDate"
            showTime
            format="YYYY-MM-DD"
            :required="true"
            v-model="startValue"
            placeholder="请选择起始日期"
            @change="startChange"
            @openChange="handleStartOpenChange"
          />&nbsp; 至 &nbsp;
          <a-date-picker
            :locale="zh_CN"
            :disabledDate="disabledEndDate"
            showTime
            format="YYYY-MM-DD"
            placeholder="请选择截止日期"
            v-model="endValue"
            :open="endOpen"
            @change="endChange"
            @openChange="handleEndOpenChange"
          />
          <span @click="tolong" style="color:#1478d5;cursor: pointer;">&nbsp; 长期</span>
        </div>
      </a-form-item>
      <!-- ,initialValue:[moment('2016-01-01', dateFormat), moment('2020-01-01', dateFormat)] -->

      <a-form-item v-bind="formItemLayout" label="营业地址">
        <a-cascader
          class="w-sty"
          v-decorator="[
                        'dobusAddress',
                        {rules: [{ required: true, message: '营业地址' }]}
                      ]"
          :options="options2"
          @change="onbusiChange"
          notFoundContent="Not found"
          placeholder="请选择营业地址"
        />
      </a-form-item>

      <a-form-item v-bind="formItemLayout" help="此地址将作为之后协议/资料寄送的默认地址，请准确填写" label="详细地址">
        <a-textarea
          v-decorator="[
                        'realAddress',
                        {rules: [{ required: true, message: '请输入营业详细地址' }]}
                      ]"
          placeholder="请输入营业详细地址"
          :rows="2"
        />
      </a-form-item>

      <a-row>
        <a-col :xs="{ span : 24 }" :sm="{ span:9 }" class="formGroupTitle">法定代表人信息</a-col>
      </a-row>
      <a-form-item v-bind="formItemLayout" label="姓名">
        <a-input
          v-decorator="[
                        'identityName',
                        {rules: [{ required: true, message: '请输入法定代表人姓名' }]}
                      ]"
          placeholder="请输入法定代表人姓名"
          @change="identityNameChange"
        />
      </a-form-item>

      <a-form-item v-bind="formItemLayout" label="证件类型">
        <div>
          <a-select
            disabled
            class="width-sty"
            v-decorator="[
                        'codetype',
                        {rules: [{ required: true, message: '请选择证件类型' }],initialValue: 'legal'}
                      ]"
          >
            <a-select-option value="legal">身份证</a-select-option>
            <a-select-option value="lucy">护照</a-select-option>
            <a-select-option value="disabled">港澳台通行证</a-select-option>
            <a-select-option value="Yiminghe">军官证</a-select-option>
            <a-select-option value="Yiminghe">户口簿</a-select-option>
          </a-select>
        </div>
      </a-form-item>

      <a-form-item v-bind="formItemLayout" label="证件号码">
        <a-input
          v-decorator="[
                        'identityNo',
                        {rules: [{ required: true, message: '请输入证件号码' },{
                           validator: validateIdentityNo
                         }],validateTrigger: 'blur'}
                      ]"
          placeholder="请输入证件号码"
        />
      </a-form-item>

      <a-form-item v-bind="formItemLayout" label="证件有效期">
        <a-date-picker
          :disabledDate="disabledDate"
          placeholder="请选择证件有效期"
          @change="dateChange"
          v-decorator="[
                        'expiryDate',
                        {rules: [{ required: true, message: '请选择证件有效期' }]}
                      ]"
        />
        <span @click="longexpiryDate" style="color:#1478d5;cursor: pointer;fontSize:13px;">&nbsp; 长期</span>
      </a-form-item>

      <a-row class="row-sty">
        <a-col :xs="{ span : 24 }" :sm="{ span:9 }" class="formGroupTitle">联系人信息</a-col>
      </a-row>
      <a-form-item v-bind="formItemLayout" label="姓名">
        <a-input
          v-decorator="[
                      'contactName',
                      {rules: [{ required: true, message: '请输入姓名' }]}
                    ]"
          placeholder="请输入姓名"
        />
      </a-form-item>
      <a-form-item v-bind="formItemLayout" label="联系电话">
        <a-input
          v-decorator="[
                            'contactPhone',
                            {
                             rules: [{ required: true, message: '请输入联系电话!' },{validator: validateCode}],validateTrigger: 'blur'
                            }
                            ]"
          placeholder="请输入联系电话"
        />
      </a-form-item>
      <a-form-item v-bind="formItemLayout" label="Email">
        <a-input
          v-decorator="[
                            'contactEmail', { rules: [{type: 'email', message: '请输入有效邮箱地址!', }, {required: true, message: '请输入邮箱地址!',},{validator: validatemail}],validateTrigger: 'blur'}
                            ]"
          placeholder="请输入Email"
        />
      </a-form-item>

      <a-row style="display:flex;align-items: center;">
        <a-col :sm="{ span:9 }" class="formGroupTitle">结算账户信息</a-col>
      </a-row>
      <a-form-item v-bind="formItemLayout" label="账户类型">
        <a-radio-group
          v-decorator="[
                          'isPrivate',
                          {
                              rules: [{
                              required: true, message: '请选择账户类型',
                              }],initialValue:'false'
                          }
                          ]"
          @change="AccountTypeChange"
        >
          <a-radio value="false">对公</a-radio>
          <a-radio value="true">对私</a-radio>
        </a-radio-group>
      </a-form-item>

      <a-form-item v-bind="formItemLayout" label="账户名称">
        <span>{{bankCard.accountName}}</span>
      </a-form-item>

      <a-form-item v-bind="formItemLayout" label="开户行名称">
        <div>
          <a-select
            :disabled="bankInfo"
            showSearch
            :notFoundContent="null"
            :defaultActiveFirstOption="false"
            :showArrow="false"
            :filterOption="false"
            @focus="handleFocus"
            @blur="handleBlur"
            @search="bankNameSearch"
            @change="bankNameChange"
            class="width-sty"
            v-decorator="[
                        'bankName',
                        {rules: [{ required: true, message: '请选择开户行名称' }]}
                      ]"
            placeholder="请输入银行名称进行选择"
          >
            <a-select-option v-for="d in seloptions" :key="d.value">{{d.label}}</a-select-option>
          </a-select>
        </div>
      </a-form-item>

      <a-form-item v-bind="formItemLayout" label="开户行所在地" required>
        <a-cascader
          :disabled="bankInfo"
          class="w-sty"
          v-model="bankaddress"
          :options="options3"
          @blur="addressBlur"
          @change="addressChange"
          placeholder="请选择开户行所在地"
        />
        <!-- v-decorator="['bankaddress ',{rules: [{ required: true, message: '请选择开户行所在地' }]}]" -->
      </a-form-item>

      <a-form-item v-bind="formItemLayout" label="支行名称">
        <div>
          <a-select
            showSearch
            @search="handleSearch"
            :disabled="bankInfo"
            labelInValue
            @change="bankBranchNameChange"
            optionFilterProp="children"
            :filterOption="filterOption"
            style="width:100%;"
            v-decorator="[
                        'bankBranchName',
                        {rules: [{ required: true, message: '请输入支行名称' }]}
                      ]"
            placeholder="请选择支行名称"
          >
            <a-select-option v-for="d in bankBranchoptions" :key="d.value">{{d.label}}</a-select-option>
          </a-select>
        </div>
      </a-form-item>

      <a-form-item v-bind="formItemLayout" label="账号">
        <a-input
          :disabled="bankInfo"
          @blur="findCardBin"
          v-decorator="[
                        'cardNo',
                        {rules: [{ required: true, message: '请输入账号' }]}
                      ]"
          placeholder="请输入账号"
        />
      </a-form-item>
      <a-form-item v-if="!idCardShow" v-bind="formItemLayout" label="联系人手机号">
        <span>{{contactBusMobile}}</span>
      </a-form-item>

      <a-form-item v-if="idCardShow" v-bind="formItemLayout" label="预留银行手机号">
        <div>
          <a-input
            name="phone"
            placeholder="请输入预留银行手机号"
            v-decorator="[
                          'mobileNo',
                          {
                           rules: [{ required: true, message: '请输入预留银行手机号!' },{validator: validateCode}],validateTrigger: 'blur'
                          }
                          ]"
          />
        </div>
      </a-form-item>
      <!-- 对私账户显示 -->
      <a-form-item v-if="idCardShow" v-bind="formItemLayout" label="持卡人身份证号">
        <span>{{idCard}}</span>
      </a-form-item>

      <a-col :xs="{ span : 24 }" :sm="{ span:14,offset:10 }">
        <a-form-item>
          <a-button
            class="submitButton"
            html-type="submit"
            :loading="submitLoading"
            type="primary"
          >下一步</a-button>
        </a-form-item>
      </a-col>
    </a-form>
  </div>
</template>
<script>
//银行信息 修改 加按钮 点击按钮可修改  默认 不可修改状态
import {
  Radio,
  Input,
  InputNumber,
  DatePicker,
  Cascader,
} from "ant-design-vue";
import pick from "lodash.pick";
import api from "@/common/api";
import { get, post } from "@/common/api";
import moment from "moment";
import zh_CN from "ant-design-vue/lib/date-picker/locale/zh_CN";
import { type } from "os";
import typeData from "../../../../static/typeData.js";
const dateFormat = "YYYY-MM-DD";

export default {
  components: {
    RangePicker: DatePicker.RangePicker,
    Cascader,
  },

  data() {
    return {
      zh_CN,
      cardType: "",
      typeDisabled: true,
      submitLoading: false,
      phoneDisabled: false,
      loading: false,
      revise: false,
      AccountTypeStatus: true,
      remark: "",
      status: "",
      mer: false,
      issend: true,
      phone: false,
      phonevalue: "",
      Confirm: false, //验证码验证是否成功
      isLegalPerson: true, //是否是法人
      emailvalue: "",
      verCode: "",
      count: "",
      timer: "",
      bankdata: "",
      bankaddress: [],
      startDate: "",
      endDate: "",
      startValue: null,
      endValue: null,
      endOpen: false,
      dateFormat: "YYYY-MM-DD",
      memberNo: "",
      idCard: "",
      // value:'',
      modify: "",
      ischeck: false,
      isempty: true,
      array: [],
      text: [],
      text2: [],
      busitext: [],
      issh: false,
      // areaOptions: '',
      // form: this.$form.createForm(this),
      expiryDate: "",
      expiryDate2: "",
      merchantName: "",
      shortName: "",
      merchantType: "",
      industryCategoryCode: "",
      industry: "",
      orgRegisterNo: "",
      orgRegisterPrincipal: "",
      orgExpiryDate: "",
      mainBusiness: "",
      realProvinceItem: "",
      realCityItem: "",
      realDistrictItem: "",
      realAddress: "",
      busiProvinceItem: "",
      busiCityItem: "",
      busiDistrictItem: "",
      placeRight: "",
      placeArea: "",
      orgEmployees: "",
      contactName: "",
      contactEmail: "",
      contactPhone: "",
      id: "",
      bankInfo: false,
      idCardShow: false,
      corpIdentify: {
        identityName: "",
        type: "legal",
        identityNo: "2222222222222",
        expiryDate: "永久",
        imgHead: null,
        imgEmblem: null,
        id: "",
      },
      actualControlIdentify: {
        identityName: "陈某某",
        type: "control",
        identityNo: "3333333333333",
        expiryDate: "2090-03-03",
        imgHead: null,
        imgEmblem: null,
        id: "",
      },
      cardHolderIdentity: {
        id: "",
        identityNo: "",
      },
      bankCard: {
        bankName: "",
        bankBranchName: "",
        bankNo: "",
        accountName: "xxxx",
        cardNo: "",
        province: "",
        city: "",
        id: "",
      },
      formItemLayout: {
        labelCol: {
          xs: { span: 24 },
          sm: { span: 9 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 14, offset: 1 },
          md: { span: 12, offset: 1 },
        },
      },
      formItemLayout1: {
        labelCol: {
          xs: { span: 24 },
          sm: { span: 11 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 12, offset: 1 },
          md: { span: 12, offset: 1 },
        },
      },
      options: [
        {
          label: "北京市",
          value: "1000",
          children: [
            {
              label: "北京市",
              value: "1000",
              children: [
                {
                  label: "东城区",
                  value: "1021",
                },
              ],
            },
          ],
        },
      ],
      options2: [
        {
          label: "北京市",
          value: "1000",
          children: [
            {
              label: "北京市",
              value: "1000",
              children: [
                {
                  label: "东城区",
                  value: "1021",
                },
              ],
            },
          ],
        },
      ],
      options3: [],
      bankBranchList: [],
      bankBranchoptions: [],
      Areaoptions: [],
      Categoryoptions: [],
      seloptions: [],
      isPrivate: false,
      legalPersonAccount: Boolean,
      contactBusMobile: "xxxxxxxxx",
      queryid: null,
      agentid: null,
      bankCardid: null,
      legalIdentityid: null,
    };
  },
  beforeCreate() {
    this.form = this.$form.createForm(this);
  },

  created() {},
  mounted() {
    localStorage.setItem("urlType", "PartnersAdmin");
    this.getareaData();

    // this.memberNo = sessionStorage.getItem("memberNo");
    // console.log('typeData', typeData)
    this.Categoryoptions = typeData.list;
    console.log(this.$route.params.queryid);
    if (this.$route.params.queryid) {
      this.queryid = this.$route.params.queryid;
      this.getExistData();
    } else {
      this.phoneDisabled = false;
    }
  },
  activated: function () {},

  watch: {
    startValue(val, dateval) {
      // console.log("startValue", val);
      // console.log(dateval);
    },
    endValue(val) {
      // console.log("endValue", val);
    },
  },

  methods: {
    moment,
    //日期不可选
    disabledDate(current) {
      // Can not select days before today and today
      return current && current < moment().endOf("day");
    },
    startChange(date, dateString) {
      console.log("startDate", dateString);
      this.startDate = dateString;
    },
    endChange(date, dateString) {
      console.log("endDate", dateString);
      this.endDate = dateString;
    },
    disabledStartDate(startValue) {
      const endValue = this.endValue;
      if (!startValue || !endValue) {
        return false;
      }
      return startValue.valueOf() > endValue.valueOf();
    },
    disabledEndDate(endValue) {
      const startValue = this.startValue;
      if (!endValue || !startValue) {
        return false;
      }
      return startValue.valueOf() >= endValue.valueOf();
    },
    handleStartOpenChange(open) {
      if (!open) {
        this.endOpen = true;
      }
      // console.log(open);
    },
    handleEndOpenChange(open) {
      this.endOpen = open;
    },

    //查询是否已有信息
    getExistData() {
      this.$axios.get("/agent/logAgent/fetch/" + this.queryid).then((res) => {
        console.log("res", res);
        if (res.data.code == "OK") {
          this.remark = res.data.data.agent.remark
            ? res.data.data.agent.remark
            : "";
          this.status = res.data.data.agent.status
            ? res.data.data.agent.status
            : null;
          //已有信息 修改
          this.modify = res.data.data;
          this.phoneDisabled = true;

          let agent = res.data.data.agent;
          let bankCard = res.data.data.bankCard;
          let legalIdentity = res.data.data.legalIdentity;
          this.memberNo = agent.memberNo;

          this.agentid = Number(agent.id);
          this.bankCardid = Number(bankCard.id);
          this.legalIdentityid = Number(legalIdentity.id);
          console.log(this.agentid, this.bankCardid, this.legalIdentityid);

          this.startValue = moment(agent.orgExpiryDateStart);
          this.endValue = moment(agent.orgExpiryDateEnd);

          this.bankaddress = [bankCard.province, bankCard.city];
          this.bankCard.id = bankCard.id;

          this.bankCard.bankBranchName = bankCard.bankBranchName;
          this.bankCard.bankNo = bankCard.bankNo;
          this.options3 = [
            {
              value: bankCard.province,
              label: bankCard.province,
              children: [
                {
                  value: bankCard.city,
                  label: bankCard.city,
                },
              ],
            },
          ];

          //赋值
          (this.isPrivate = bankCard.isPrivate),
            this.$nextTick(() => {
              this.form.setFieldsValue({
                email: res.data.data.email,
                phone: res.data.data.mobile,
                merchantType: agent.merchantType,
                merchantName: agent.merchantName,
                shortname: agent.shortName,
                orgRegisterNo: agent.orgRegisterNo,
                orgExpiryDateEnd: this.endValue,
                orgExpiryDateStart: this.startValue,
                //营业地址
                dobusAddress: [
                  agent.realProvince,
                  agent.realCity,
                  agent.realDistrict,
                ],
                realAddress: agent.realAddress,

                //联系人
                contactName: agent.contactName,
                contactPhone: agent.contactPhone,
                contactEmail: agent.contactEmail,

                identityName: legalIdentity.identityName,
                identityNo: legalIdentity.identityNo,
                expiryDate: moment(legalIdentity.expiryDate),

                isPrivate: bankCard.isPrivate + "",
                accountName: bankCard.accountName,
                bankName: bankCard.bankName,
                bankBranchName: {
                  key: bankCard.bankNo,
                  label: bankCard.bankBranchName,
                },
                mobileNo: bankCard.mobileNo,
                cardNo: bankCard.cardNo,

                province: bankCard.province,
                city: bankCard.city,
              });
              this.handleChange1(agent.merchantType);
              // 账户信息赋值
              if (!bankCard.isPrivate) {
                // 对公
                this.getPubData();
                // this.bankCard.accountName = agent.merchantName
                // this.contactBusMobile = agent.contactPhone
              } else {
                this.getPriData();
                // this.bankCard.accountName = bankCard.accountName
              }
            });
        }
      });
    },
    handleSubmit(e) {
      e.preventDefault();
      // 企业客户提交
      this.form.validateFields((err, values) => {
        if (!err) {
          this.orgRegisterNo = values.orgRegisterNo;

          if (!this.startValue || !this.endValue) {
            this.$message.warning("请选择营业期限");
            return false;
          }
          this.orgExpiryDate = this.startDate + "," + this.endDate;
          if (!this.orgExpiryDate || this.orgExpiryDate == ",") {
            this.orgExpiryDate = "";
          }
          sessionStorage.setItem("isPrivate",this.isPrivate)
          //  单位客户资料登记
          let logAgentInfo = {
            merchantType: values.merchantType,
            merchantName: values.merchantName,
            shortName: values.shortname,
            orgRegisterNo:
              values.orgRegisterNo || this.modify.agent.orgRegisterNo,
            orgExpiryDateEnd:
              this.endDate || this.modify.agent.orgExpiryDateEnd,
            orgExpiryDateStart:
              this.startDate || this.modify.agent.orgExpiryDateStart,
            //营业地址
            realProvince:
              this.busiProvinceItem.value || this.modify.agent.realProvince,
            realCity: this.busiCityItem.value || this.modify.agent.realCity,
            realDistrict:
              this.busiDistrictItem.value || this.modify.agent.realDistrict,
            realProvinceName:
              this.busiProvinceItem.label || this.modify.agent.realProvinceName,
            realCityName:
              this.busiCityItem.label || this.modify.agent.realCityName,
            realDistrictName:
              this.busiDistrictItem.label || this.modify.agent.realDistrictName,
            realAddress: values.realAddress,

            //联系人
            contactName: values.contactName,
            contactPhone: values.contactPhone,
            contactEmail: values.contactEmail,
          };

          let legalLogIdentity = {
            identityName: values.identityName,
            identityNo: values.identityNo,
            expiryDate: this.expiryDate,
          };

          let logBankCard = {
            isPrivate: this.isPrivate,
            accountName: this.bankCard.accountName,
            bankName: values.bankName || this.modify.bankCard.bankName,
            bankBranchName:
              values.bankBranchName.label ||
              this.modify.bankCard.bankBranchName,
            bankNo: values.bankBranchName.key || this.modify.bankCard.bankNo,
            mobileNo: values.mobileNo || this.contactBusMobile,
            cardNo: values.cardNo || this.modify.bankCard.cardNo,

            province: this.bankaddress[0] || this.modify.bankCard.province,
            city: this.bankaddress[1] || this.modify.bankCard.city,
          };

          let data = {
            logAgentInfo: logAgentInfo,
            legalLogIdentity: legalLogIdentity,
            logBankCard: logBankCard,
            // email:values.email,
            phone: values.phone,
          };
          // console.log(data);
          if (this.modify) {
            let agentInfoUpdateRequest = {
              memberNo: this.memberNo,
              id: this.agentid,

              merchantType: values.merchantType,
              merchantName: values.merchantName,
              shortName: values.shortname,
              orgRegisterNo:
                values.orgRegisterNo || this.modify.agent.orgRegisterNo,
              orgExpiryDateEnd:
                this.endDate || this.modify.agent.orgExpiryDateEnd,
              orgExpiryDateStart:
                this.startDate || this.modify.agent.orgExpiryDateStart,
              //营业地址
              realProvince:
                this.busiProvinceItem.value || this.modify.agent.realProvince,
              realCity: this.busiCityItem.value || this.modify.agent.realCity,
              realDistrict:
                this.busiDistrictItem.value || this.modify.agent.realDistrict,
              realProvinceName:
                this.busiProvinceItem.label ||
                this.modify.agent.realProvinceName,
              realCityName:
                this.busiCityItem.label || this.modify.agent.realCityName,
              realDistrictName:
                this.busiDistrictItem.label ||
                this.modify.agent.realDistrictName,
              realAddress: values.realAddress,

              //联系人
              contactName: values.contactName,
              contactPhone: values.contactPhone,
              contactEmail: values.contactEmail,
            };
            let uplegalLogIdentity = {
              id: this.legalIdentityid,
              identityName: values.identityName,
              identityNo: values.identityNo,
              expiryDate:
                this.expiryDate || this.modify.legalIdentity.expiryDate,
            };

            let uplogBankCard = {
              id: this.bankCardid,
              isPrivate: this.isPrivate,
              accountName: this.bankCard.accountName,
              bankName: values.bankName || this.modify.bankCard.bankName,
              bankBranchName:
                values.bankBranchName.label ||
                this.modify.bankCard.bankBranchName,
              bankNo: values.bankBranchName.key || this.modify.bankCard.bankNo,
              mobileNo: values.mobileNo || this.contactBusMobile,
              cardNo: values.cardNo || this.modify.bankCard.cardNo,

              province: this.bankaddress[0] || this.modify.bankCard.province,
              city: this.bankaddress[1] || this.modify.bankCard.city,
            };
            let updata = {
              agentInfoUpdateRequest: agentInfoUpdateRequest,
              legalLogIdentity: uplegalLogIdentity,
              logBankCard: uplogBankCard,
            };
            this.submitLoading = true;
            this.updateData(updata);
          } else {
            this.submitLoading = true;
            this.addnewData(data);
          }
        }
      });
    },
    // 客户信息新增
    addnewData(data) {
      console.log("data", data);
      this.$axios.post("/agent/logAgent/new", data).then(
        (res) => {
          console.log("update", res);
          if (res.data.code == "OK") {
            this.submitLoading = false;
            this.memberNo = res.data.data.memberNo;
            this.queryid = res.data.data.id;
            this.$router.push({
              name: "/Partners/dataUploadA/step2",
              params: {
                memberNo: this.memberNo,
                updata: "false",
                isPrivate: this.isPrivate,
                queryid: this.queryid,
              },
            });
          } else {
            this.submitLoading = false;
            this.$message.error(res.data.message);
          }
        },
        (err) => {
          this.submitLoading = false;
          console.log(err);
        }
      );
    },
    // 客户信息修改提交
    updateData(data) {
      console.log("data", data);
      this.$axios.post("/agent/logAgent/update/basic", data).then(
        (res) => {
          console.log("update", res);
          if (res.data.code == "OK") {
            this.submitLoading = false;

            this.$router.push({
              name: "/Partners/dataUploadA/step2",
              params: {
                memberNo: this.memberNo,
                updata: "true",
                isPrivate: this.isPrivate,
                queryid: this.queryid,
              },
            });
          } else {
            this.submitLoading = false;
            this.$message.error(res.data.message);
          }
        },
        (err) => {
          this.submitLoading = false;
          console.log(err);
        }
      );
    },
    validateIdentityNo(rule, value, callback) {
      const form = this.form;
      if (value && !/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(value)) {
        callback("您输入的身份证号码格式有误！");
      } else {
      }
      callback();
    },
    validateIdentityNo2(rule, value, callback) {
      const form = this.form;
      if (value && !/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(value)) {
        callback("您输入的身份证号码格式有误！");
      } else {
      }
      callback();
    },
    validateOrgRegisterNo(rule, value, callback) {
      const form = this.form;
      if (value) {
        let len = value.length;
        if (value && len != 18 && len != 15) {
          callback("您输入的社会统一信用代码有误！");
        } else {
          this.payPassword = value;
        }
      }
      callback();
    },
    validateCode(rule, value, callback) {
      if (value && !/^1(3|4|5|6|7|8|9)\d{9}$/.test(value)) {
        this.phone = false;
        callback("您输入的手机号格式有误！");
        return;
      } else {
        if (!value) {
          this.phone = false;
        } else {
          this.phone = true;
          this.phonevalue = value;
        }
        callback();
      }
    },
    validateverCode(rule, value, callback) {
      const reg = new RegExp("^[0-9]{4,10}$");
      if (value && !reg.test(value)) {
        callback("您输入的验证码格式有误！");
      } else {
        this.verCode = value;
      }
      callback();
    },
    // 验证码验证
    verCodecom() {
      let phone = this.form.getFieldValue("mobileNo");
      this.$axios
        .get(
          "/agent/customer/org/bank/mobile/check/" + phone + "/" + this.verCode
        )
        .then((res) => {
          if (res.data.code == "OK") {
            this.$message.success(res.data.message);
          } else {
            this.$message.error(res.data.message);
            return false;
          }
        });
    },
    validatemail(rule, value, callback) {
      const reg = new RegExp(
        "^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$"
      );
      if (value && !reg.test(value)) {
        callback("您输入的邮箱格式有误！");
        return;
      } else {
        this.emailvalue = value;
        console.log(this.emailvalue);
        callback();
      }
    },
    //对公赋值
    getPubData() {
      this.idCardShow = false;
      let mobile = this.form.getFieldValue("phone");
      if (mobile) {
        this.contactBusMobile = mobile;
      }
      let merchantName = this.form.getFieldValue("merchantName");
      if (merchantName) {
        this.bankCard.accountName = merchantName;
      } else {
        this.$message.warning("请填写客户名称！");
      }
      this.isPrivate = false;
      if (this.modify) {
        this.bankCard.accountName = this.form.getFieldValue("merchantName")
          ? this.form.getFieldValue("merchantName")
          : this.modify.merchantPosp.merchantName;
      }
    },
    //对私赋值
    getPriData() {
      this.isPrivate = true;
      // if (this.mer) {
      let identityName = this.form.getFieldValue("identityName");
      if (identityName) {
        this.bankCard.accountName = identityName;
      } else {
        this.$message.warning("请输入法人姓名！");
      }
      let identityNo = this.form.getFieldValue("identityNo");
      if (identityNo) {
        this.idCard = identityNo;
      } else {
        this.$message.warning("请输入法人身份证号！");
      }
      // }
      this.idCardShow = true;
    },
    handleChange(value, selectedOptions) {
      console.log("typeChange", typeof value, value);
      console.log(selectedOptions);
      let arr = value;
      let labelarr = selectedOptions;
      this.array = [];
      if (labelarr) {
        if (labelarr.length > 0) {
          for (var i = 0; i < labelarr.length; i++) {
            this.array.push(labelarr[i].label);
          }
        }
      }
      this.industry = {
        value: arr.join("|"),
        label: this.array.join("|"),
      };
      console.log(this.industry);
    },
    handleChange1(value) {
      if (value == "mer") {
        this.mer = true;
        // this.idCardShow = true;
        // this.AccountTypeStatus = false;
      } else {
        this.mer = false;
        // this.idCardShow = false;
        // this.AccountTypeStatus = true;
        // this.form.setFieldsValue({
        //     isPrivate: 'false'
        // })
      }
    },
    tolong() {
      this.endValue = moment("9999-01-01");
      this.endDate = "9999-01-01";
    },
    onPrev(step) {
      var st = step - 1;
      this.$router.push("/OrgRegister/step" + st);
    },
    doNext(step) {
      // var st = step + 1;
      // this.$router.push("/OrgRegister/step" + st);
      this.$router.push(`/Partners/dataUpload${step}/step2`);
    },
    getareaData() {
      this.$axios.get("/agent/division/all").then((res) => {
        const result = res.data;
        if (res.data.list) {
          let list = result.list;
          let arr = [];
          let newArr = list.map((item, index, list) => {
            let test = {
              label: item.label,
              value: item.value,
              children: [],
            };
            arr.push(test);
            if (item.children) {
              let children = [];
              for (let i = 0; i < item.children.length; i++) {
                let test2 = {
                  label: item.children[i].label,
                  value: item.children[i].value,
                  children: [],
                };
                children.push(test2);

                if (item.children[i].children) {
                  let child2 = [];
                  for (let a = 0; a < item.children[i].children.length; a++) {
                    let test3 = {
                      label: item.children[i].children[a].label,
                      value: item.children[i].children[a].value,
                    };
                    child2.push(test3);
                  }
                  children[i].children = child2;
                }
              }
              arr[index]["children"] = children;
            }
            return arr;
          });
          // console.log("newArr", newArr);
          this.options = newArr[0];
          this.options2 = newArr[0];
     
        } else {
        }
      });
    },
    placeRightChange(e) {
      console.log("radio checked", e.target.value);
      // if (e.target.value == "b") {
      //   this.docking = false;
      // } else {
      //   this.docking = true;
      // }
    },
    onChange(value, selectedOptions) {
      console.log("changevalue", typeof value, value);
      this.text = value;
      // this.text = selectedOptions.map(o => o.label);
      if (selectedOptions.length == 1) {
      } else if (selectedOptions.length == 2) {
      } else if (selectedOptions.length == 3) {
        this.realProvinceItem = {
          label: selectedOptions[0].label,
          value: selectedOptions[0].value,
        };
        this.realCityItem = {
          label: selectedOptions[1].label,
          value: selectedOptions[1].value,
        };
        this.realDistrictItem = {
          label: selectedOptions[2].label,
          value: selectedOptions[2].value,
        };
      } else {
        console.log(selectedOptions);
      }
      console.log("this.text", this.text);
      console.log(
        this.realProvinceItem,
        this.realCityItem,
        this.realDistrictItem
      );
    },
    onbusiChange(value, selectedOptions) {
      console.log("changevalue", typeof value, value);
      this.busitext = value;
      // this.busitext = selectedOptions.map(o => o.label);
      console.log("selectedOptions", selectedOptions);
      if (selectedOptions.length == 1) {
      } else if (selectedOptions.length == 2) {
      } else if (selectedOptions.length == 3) {
        this.busiCityItem = {
          label: selectedOptions[1].label,
          value: selectedOptions[1].value,
        };
        this.busiProvinceItem = {
          label: selectedOptions[0].label,
          value: selectedOptions[0].value,
        };
        this.busiDistrictItem = {
          label: selectedOptions[2].label,
          value: selectedOptions[2].value,
        };
      } else {
        console.log(selectedOptions);
      }
      console.log("this.busitext", this.busitext);
      // this.busiProvince = this.busitext[0];
      // this.busiCityItem = this.busitext[1];
      // this.busiDistrictItem = this.busitext[2];
    },
    addressChange(value, selectedOptions) {
      console.log("addressChange", value);
      this.text2 = value;
      this.bankaddress = value;
      // this.text2 = selectedOptions.map(o => o.label);
      console.log("this.text2", this.text2);
      // if (selectedOptions.length == 1) {
      //   this.bankCard.province = {
      //     label: selectedOptions[0].label,
      //     value: selectedOptions[0].value
      //   };
      // } else if (selectedOptions.length == 2) {
      //   this.bankCard.city = {
      //     label: selectedOptions[1].label,
      //     value: selectedOptions[1].value
      //   };
      // } else if (selectedOptions.length == 3) {
      //   this.bankCard.district = {
      //     label: selectedOptions[2].label,
      //     value: selectedOptions[2].value
      //   };
      // }else {
      //   console.log(selectedOptions);
      // }

      this.bankCard.province = this.text2[0];
      this.bankCard.city = this.text2[1];
      // this.bankCard.district = this.text2[2];
    },
    phoneChange(e) {
      this.contactBusMobile = e.target.value;
    },
    merchantNameChange(e) {
      this.bankCard.accountName = e.target.value;
    },

    shareTypeChange(e) {
      console.log("value", e.target.value);
    },
    AccountTypeChange(e) {
      console.log("value", e.target.value);
      if (e.target.value == "true") {
        this.getPriData();
      } else {
        this.getPubData();
      }
    },
    AccountAscriptionChange(e) {
      console.log("value", e.target.value);
      if (e.target.value == "true") {
        this.isLegalPerson = true;
        let identityNo = this.form.getFieldValue("identityNo");
        let identityName = this.form.getFieldValue("identityName");
        // if (identityNo) {
        //     this.form.setFieldsValue({
        //         idCard: identityNo
        //     });
        // } else {
        //     this.$message.warning('请输入法人身份证号！')
        // }
        if (identityName) {
          this.form.setFieldsValue({
            accountName: identityName,
          });
        } else {
          this.$message.warning("请输入法人姓名！");
        }
      } else {
        this.isLegalPerson = false;
      }
    },
    identityNameChange(e) {
      let merchantType = this.form.getFieldValue("merchantType");
      if (merchantType == "mer") {
        this.form.setFieldsValue({
          accountName: e.target.value,
        });
        this.isempty = false;
      }
    },
    agentCodeNameChange(e) {
      // let merchantType = this.form.getFieldValue("merchantType");
      // if (merchantType == "mer") {
      // this.form.setFieldsValue({
      //     accountName: e.target.value
      // });
      // this.isempty = false;
      // }
    },
    tosame() {
      let name = this.form.getFieldValue("identityName");
      let identityNo = this.form.getFieldValue("identityNo");
      let expiryDate = this.form.getFieldValue("expiryDate");
      this.form.setFieldsValue({
        identityName2: name,
        identityNo2: identityNo,
        expiryDate2: expiryDate,
      });
      let arr = JSON.stringify(expiryDate).split("T");
      this.expiryDate2 = arr[0].replace(/"/, "");
    },
    onChange2(e) {
      console.log("changevalue2", e.target.checked);
      if (e.target.checked == true) {
        this.ischeck = true;
      } else {
        this.ischeck = false;
      }
    },
    dateChange(date, dateString) {
      console.log("dateString", dateString);
      this.expiryDate = dateString;
    },
    dateChange2(date, dateString) {
      console.log("dateString2", dateString);
      this.expiryDate2 = dateString;
    },
    longexpiryDate() {
      this.$nextTick(() => {
        this.form.setFieldsValue({
          expiryDate: moment("9999-01-01"),
        });
      });
      this.expiryDate = "9999-01-01";
    },
    longexpiryDate2() {
      this.$nextTick(() => {
        this.form.setFieldsValue({
          expiryDate2: moment("9999-01-01"),
        });
      });
      this.expiryDate2 = "9999-01-01";
    },
    // 开户名称搜索
    bankNameSearch(value) {
      // console.log(value);
      let data = {
        bankSuper: value,
      };
      api.getBankName(data, (res) => {
        if (res.code == "OK") {
          this.seloptions = [];
          console.log("res.data", typeof res.list, res.list);
          res.list.forEach((r) => {
            this.seloptions.push({
              value: r.value,
              label: r.label,
            });
          });
          console.log(this.seloptions);
        } else {
          console.log("res", res);
        }
      });
      console.log(this.seloptions);
    },
    bankNameChange(value) {
      console.log(value);
      this.form.setFieldsValue({
        bankName: value,
      });
      let data = {
        bankSuper: value,
      };
      api.getBankName(data, (res) => {
        console.log("res", res);
        if (res.code == "OK") {
          this.seloptions = [];
          console.log("res.data", typeof res.list, res.list);
          res.list.forEach((r) => {
            this.seloptions.push({
              value: r.value,
              label: r.label,
            });
          });
          console.log(this.seloptions);
        } else {
          console.log("res", res);
        }
      });
    },
    bankBranchNameChange(value) {
      console.log("value", value);
      this.bankCard.bankNo = value.key;
      this.bankCard.bankBranchName = value.label;
    },
    handleFocus() {
      console.log("focus");
    },
    handleBlur() {
      let selvalue = this.form.getFieldValue("bankName");
      if (selvalue) {
        console.log("开户行:", selvalue);
        let data = {
          bankCode: selvalue,
        };
        api.getBankArea(
          data,
          (res) => {
            console.log("res", res);
            if (res.code == "OK") {
              this.options3 = res.list;
            } else {
              console.log(res);
            }
          },
          (err) => {
            console.log(err);
          }
        );
      } else {
        // console.log("开户行为空", selvalue);
      }
    },
    // 开户地址失去焦点
    addressBlur() {
      let selvalue = this.form.getFieldValue("bankName");
      console.log("开户行地址：", this.text2);
      if (this.text2) {
        let data = {
          bankCode: selvalue,
          province: this.text2[0],
          city: this.text2[1],
          bankName: "",
        };
        api.getBankBranch(
          data,
          (res) => {
            console.log("res", res);
            if (res.code == "OK") {
              this.bankBranchoptions = res.list;
              this.bankBranchList = res.list;
            } else {
              console.log(res);
            }
          },
          (err) => {
            console.log(err);
          }
        );
      } else {
        console.log("开户行地址为空");
      }
    },
    // 支行地址搜索
    handleSearch(value) {
      // console.log(value)
      if (escape(value).indexOf("%u") < 0) {
        let keywords = value;
        var newList = [];
        this.bankBranchoptions.forEach((item) => {
          if (item.label.indexOf(keywords) != -1) {
            newList.push(item);
          }
        });
        this.bankBranchoptions = newList;
      } else {
        this.bankBranchoptions = this.bankBranchList;
      }
    },
    //卡号
    findCardBin() {
      if (!this.mer) {
        return;
      }
      let selvalue = this.form.getFieldValue("cardNo");
      console.log(selvalue);
      let isnum = /^\d+$/.test(selvalue);
      if (!isnum) {
        console.log("cg");
        return false;
      }
      this.$axios.get("/agent/card/bin/search/" + selvalue).then(
        (res) => {
          console.log("res", res);
          if (res.data.code == "OK") {
            this.cardType = res.data.data.cardtype;
          } else if (res.data.code == "NEED_LOGIN") {
          } else {
            // this.$message.warning("卡号有误！");
          }
        },
        (err) => {
          console.log(res);
        }
      );
    },
    filterOption(input, option) {
      return (
        option.componentOptions.children[0].text
          .toLowerCase()
          .indexOf(input.toLowerCase()) >= 0
      );
    },
    // 获取验证码
    getCode() {
      if (this.phone) {
        this.getBankcode();
        const TIME_COUNT = 60;
        if (!this.timer) {
          this.count = TIME_COUNT;
          this.issend = false;
          this.timer = setInterval(() => {
            if (this.count > 0 && this.count <= TIME_COUNT) {
              this.count--;
            } else {
              this.issend = true;
              clearInterval(this.timer);
              this.timer = null;
            }
          }, 1000);
        }
      } else {
        this.$message.warning("请输入银行预留手机号");
      }
    },
    getBankcode() {
      let mobileNo = this.form.getFieldValue("mobileNo");
      this.loading = true;
      this.$axios.get("/agent/customer/org/bank/mobile/vcode/" + mobileNo).then(
        (res) => {
          console.log("res", res);
          if (res.data.code == "OK") {
            this.loading = false;
          } else {
            this.$message.warning(res.data.message)
            this.loading = false;
          }
        },
        (err) => {
          console.log(res);
        }
      );
    },
    bankInfoModify() {
      this.bankInfo = false;
    },
  },
};
// }
</script>


<style lang="less" scoped>
.ant-input {
  width: 50%;
}

.btn-sty {
  background-color: #ccc;
  border: 1px solid #ccc;
  color: #333;
}

.formGroupTitle {
  font-size: 20px;
  font-weight: bold;
  text-align: right;
  margin-bottom: 20px;
}

.text-div {
  text-align: center;
}

.text-div button {
  margin: 0 10px;
}

.width-sty {
  width: 50%;
}

.w-sty {
  width: 80%;
}

.result {
  color: red;
  text-align: right;
}

.submitButton {
  width: 10vw;
}

/deep/.ant-tabs-nav-scroll {
  text-align: center;
}

.ant-tabs-nav .ant-tabs-tab-active {
  color: #b3292c;
  font-weight: 500;
  border-top: 1px solid #b3292c;
  border-left: 1px solid #b3292c;
  border-radius: 5px 5px;
  border-right: 1px solid #b3292c;
}
</style>